<template>
    <el-container>
        <el-aside width="400px">
            <el-tree
                    :data="CourseTypeTree"
                    :props="defaultProps"
                    accordion>
            </el-tree>
        </el-aside>
        <el-main>Main</el-main>
    </el-container>
</template>

<script>
    export default {
        data(){
            return{
                CourseTypeTree:[],//课程类型树的数据
                defaultProps: {//课程树现被选中的值和，从什么字段中取值
                    children: 'children',
                    label: 'name'
                }
            }
        },
        methods:{
            //获取课程类型树的数据的方法
            getCourseTypeTreeData(){
                this.$http.get("/course/courseType/getCourseTypeTree").then(res=>{
                   this.CourseTypeTree = res.data.resultObj;
                   console.log(res.data)
                })
            }
        },
        mounted(){
            this.getCourseTypeTreeData()
        }
    }
</script>

<style scoped>
    .el-aside {
        border:1px solid #ccc;
        height: 550px;
        margin-top: 10px;
    }
    .el-main {
        border:1px solid #ccc;
        border-left: none;
        margin-top: 10px;
    }
    body > .el-container {
        margin-bottom: 40px;
    }
</style>